<template>
	<div id="find-music">
	  <!-- 顶部导航 -->
	  <TopNav :tabitem="topnav" />
	  <!-- 内容 -->
	  <div class="music-content w">
		<transition name="el-fade-in-linear">
		  <keep-alive>
			<router-view></router-view>
		  </keep-alive>
		</transition>
	  </div>
	</div>
  </template>
  
  <script setup>
  import { ref, onActivated } from 'vue';
  import TopNav from '@/components/common/TopNav.vue';
  
  const topnav = [
	{
	  name: '个性推荐',
	  path: '/recommend/recommendmusic',
	},
	{
	  name: '精品歌单',
	  path: '/recommend/recsonglist',
	},
	{
	  name: '排行榜',
	  path: '/recommend/songrank',
	},
	{
	  name: '歌手',
	  path: '/recommend/singer',
	},
	{
	  name: '最新音乐',
	  path: '/recommend/newsongs',
	},
  ];
  
  // 在组件激活时滚动到页面顶部
  onActivated(() => {
	document.querySelector('.view').scrollTop = 0;
  });
  </script>
  
  <style lang="less" scoped>
  .music-content {
	overflow-y: scroll;
  }
  </style>
  